*{
    margin: 0;
    padding: 0;
}
.title.small{
    color: #49BFF8!important;
    line-height: 3vh;
    // padding-top: 1vh;
    text-align: center;
    font-size: 0.8vw!important;
}
.btn-group{
    width: 13vw;
    height: 3vh;
    margin: 1vh auto;
    display: flex;
    justify-content: space-between;
    button{
        width: 50%; 
        height: 100%;
        border: 0;
        outline: none;
        &.nofocus{
            background-color: rgba(142,142,142, 0.2);
            color: rgba(255, 255, 255, 0.3); 
        }
        &.focus{
            background-color: rgba(162,162,162, 0.3);
            color: #fff;
            font-weight: 900;
        }
    }
}
.container{
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-image: url(../img/bg.png);
    background-size: 100% 100%;
    display: flex;
    justify-content: space-between;
    position: relative;
    &>.left{
        width: 35.5%;
    }
    &>.center{
        width: 28%;
    }
    &>.right{
        width: 36.5
    }
    .left{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        &>div{
            background-image: url(../img/box.png);
            background-size: 100% 100%;
        }
        .resourceUseStatus, .serviceTimes, .changeClassDaily, .meetingRoomDaily{
            width: 50%;
            height: 33vh;
        }
        .consumeDaily{
            width: 100%;
            height: 34vh;
        }
    }
    .right{
        width: 36.5%;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        .energyConsumption, .energyConsumptionTotal, .energyCenter, .tactful{
            width: 50%;
            height: 34vh;
        }
        .energyConsumptionCensus{
            width: 100%;
            height: 33vh;

        }
    }
    .successBig{
        position: absolute;
        width: 10vw;
        height: 6vh;
        display: none;
        left: 45vw;
        top: 25vh;
        z-index: 3;
        border-radius: 5px;
        overflow: hidden;
    }
    .success{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        color: rgba(255, 255, 255, 0.8);
        background-color: #12151C;
        text-align: center;
        img{
            width: 1vw;
            height: 1vw;
            margin-right: 1vw;
        }
    }
    .getAllOperationGroup{
        position: absolute;
        display: none;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.7);
        z-index: 2;
        margin: auto;
        color: rgba(255, 255, 255, 0.3);
        div.content{
            margin: auto auto;
            margin-top: 33vh;
            width: 12%;
            height: 32vh;
            background-color: #12151C;
            position: relative;
            .titles{
                padding-left: 1vw;
                padding-top: 1vh;
                padding-bottom: 1vh;
            }
            .item{
                display: flex;
                justify-content: center;
                align-items: center;
                line-height: 5vh;
            }
            .icon{
                width: 8%;
                padding-top: 0.1vh;

            }
            .name{
                width: 65%;
                margin-left: 2%;
            }
            .buttonGroup{
                position: absolute;
                width: 100%;
                height: 5vh;
                bottom: 0;
                display: flex;
                flex-direction: row-reverse;
                button{
                    width: 3.5vw;
                    height: 3vh;
                    border: 0;
                    outline: none;
                    text-align: center;
                    margin-right: 1vw;
                    cursor: pointer;
                }
                .cancel{
                    background-color: #35383E;
                    color: rgba(255, 255, 255, 0.8);
                    border: 1px solid rgba(255, 255, 255, 0.8)
                }
                .confirm{
                    background-color: rgba(43, 153, 255, 0.5);
                    color: #2B99FF;
                    border: 1px solid #2B99FF;
                }
            }
        }
    }
}